import React, {useState, useEffect} from "react";
import classNames from "classnames";
import * as styles from './index.less';


function TimeLine(props) {
    const [items, setItems] = useState([]);
    const {className = ''} =  props

    useEffect(() => {
      setItems(props.items)
    }, [props.items])

    return <ul className={`time_line_content ${className}`}>
        {
          items.map((item, index) => {
            return <li key={index}>
              <div className="circle" />
                <div className="line" />
                <div className="text">
                  <>
                  {item.childrens}
                  </>
                 
                  </div>
            </li>
          })
        }
    </ul>
}
export default TimeLine